import { DATE_CUTS, INIT_SEARCH_TIME, GET_USER_IDS } from '@/utils/const';
import userStore from '@/store/modules/user';

// 注入组件内数据
const componentData = ref({});
export const injectData = obj => {
  componentData.value = { ...componentData.value, ...obj };
};

// 表格选择
export const selectList = ref([]);

// 查询表单
export const searchParams = reactive({});

watch(
  () => searchParams.applyRange,
  val => {
    INIT_SEARCH_TIME(searchParams, val, 'begin_at', 'end_at');
  },
  { immediate: true }
);

// 查询条件
export const formItems = reactive({
  advertisement_account_id: {
    component: 'input',
    label: '广告账户ID',
    placeholder: '请输入广告账户ID',
    maxlength: 100
  },
  advertisement_account: {
    component: 'input',
    label: '广告账户名称',
    placeholder: '请输入广告账户名称',
    maxlength: 100
  },
  fb_email: {
    component: 'input',
    label: '投放个号',
    placeholder: '请输入投放个号',
    maxlength: 100
  },
  advertisement_account_type_id: {
    component: 'select',
    filterable: true,
    label: '账户类型',
    clearable: false,
    options: [{ label: '全部', value: undefined }]
  },
  advertisement_account_status: {
    component: 'select',
    filterable: true,
    label: '账户状态',
    clearable: false,
    options: [{ label: '全部', value: undefined }]
  },
  business_group_id: {
    component: 'select',
    filterable: true,
    label: '业务组',
    clearable: false,
    options: []
  },
  user_name: {
    component: 'input',
    label: '使用人员',
    placeholder: '请输入使用人员',
    showOnly: true,
    maxlength: 100,
    input() {
      searchParams.user_ids = GET_USER_IDS(searchParams.user_name);
    }
  },
  applyRange: {
    component: 'date-picker',
    type: 'daterange',
    label: '创建时间',
    clearable: true,
    showOnly: true,
    shortcuts: [
      { text: '最近7天', value: () => DATE_CUTS.LAST_7_DAYS() },
      { text: '本周', value: () => DATE_CUTS.THIS_WEEK() },
      { text: '本月', value: () => DATE_CUTS.THIS_MONTH() },
      { text: '上周', value: () => DATE_CUTS.PREV_WEEK() },
      { text: '上月', value: () => DATE_CUTS.PREV_MONTH() },
      { text: '最近31天', value: () => DATE_CUTS.LAST_31_DAYS() },
      { text: '最近180天', value: () => DATE_CUTS.LAST_180_DAYS() }
    ]
  }
});

// 表格字段
export const columns = ref([
  {
    type: 'selection',
    fixed: 'left',
    width: '50',
    reserveSelection: true,
    selectable(row) {
      if (!selectList.value.length) return true;
      const firstInfo = selectList.value[0];
      // 同一个团队同一个使用人员
      const flag1 = row?.group?.id && firstInfo?.group?.id === row?.group?.id;
      const flag2 = row?.user_id && firstInfo?.user_id === row?.user_id;
      return flag1 && flag2;
    }
  },
  { prop: 'fb_advertisement_account_id', label: '广告账户ID' },
  { prop: 'fb_advertisement_account', label: '广告账户名称' },
  { prop: 'fb_email', label: '投放个号' },
  { prop: 'fb_advertisement_account_type.name', label: '账户类型' },
  { prop: 'fb_advertisement_account_status', label: '账户状态' },
  { prop: 'time_zone', label: '时区' },
  { prop: 'balance', slot: 'balance', label: '账户余额' },
  { prop: 'business_group.name', label: '业务组' },
  { prop: 'group.name', label: '所属团队' },
  {
    prop: 'user_id',
    label: '使用人员',
    format(data) {
      return userStore().userMap[data]?.label;
    }
  },
  {
    label: '操作',
    width: '120px',
    fixed: 'right',
    buttons: [
      {
        label: '详情',
        click({ row }) {
          componentData.value.handleDetail(row);
        }
      }
    ]
  }
]);
